<!-- 基础设置 -> 账套设置 -> 账户启用 -->
<template>
  <div class="set-wrapper">
    <div class="wh100 resize-table-container">
      <a-card :bordered="false">
        <!-- <template slot="extra">
          <a-button class="btn-open mr-3" type="primary" @click="enabled"
            >启用</a-button
          >
          <a-button class="btn-close" type="danger" @click="unabled"
            >禁用</a-button
          >
        </template> -->
        <a-table
          rowKey="moduleCode"
          class="a-base-table"
          :columns="columns"
          :pagination="false"
          :data-source="dataSource"
          :loading="loading"
          @change="onTableChange"
          bordered
        >
          <template slot="changestate" slot-scope="text, record">
            <a-switch
              checked-children="启用"
              un-checked-children="禁用"
              :default-checked="text"
              @change="changeState(text, record)"
            />
          </template>
        </a-table>
      </a-card>

      <!-- <div class="a-button-bar"> -->
      <!-- <div style="margin-right:15px">
          <span>会计年度：</span>
          <a-month-picker v-model="date" placeholder="选择年度" />
        </div>-->
      <!-- <span style="margin-right:15px">本位币：人民币</span> -->
      <!-- <a-button class="btn-open" type="primary" @click="enabled">启用</a-button>
        <a-button class="btn-close" type="danger" @click="unabled">禁用</a-button>
      </div> -->
      <!-- <a-table
        rowKey="moduleCode" 
        class="a-base-table"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,getCheckboxProps}"
        :columns="columns"
        :pagination="false"
        :data-source="dataSource"
        :scroll="scroll"
        :loading="loading"
        @change="onTableChange"
        bordered
      ></a-table> -->
    </div>
  </div>
</template>
<script>
import {
  list as ListAccountModule,
  save as SaveAccountModule
} from "@/api/erp/accountModule";
export default {
  data() {
    const columns = [
      {
        title: "系统编码",
        width: 60,
        dataIndex: "moduleCode",
        key: "moduleCode"
      },
      {
        title: "系统名称",
        width: 70,
        dataIndex: "moduleName",
        key: "moduleName"
      },
      {
        title: "会计年份",
        width: 70,
        dataIndex: "enableAccountYear",
        key: "enableAccountYear"
      },
      {
        title: "会计期间",
        width: 80,
        dataIndex: "enableAccountMonth",
        key: "enableAccountMonth"
      },
      {
        title: "自然日期",
        width: 100,
        dataIndex: "enableDate",
        key: "enableDate"
      },
      {
        title: "状态",
        width: 60,
        dataIndex: "status",
        key: "status",
        scopedSlots: { customRender: "changestate" }, //引入的插槽
        // customRender: (text, record) => {
        //   console.log(text)
        //   return <a-tag color={text == null ? "gray" : text == 1 ? 'green' : 'red'}>{text == null ? "未启用" :text == 1 ? '启用' : '禁用'}</a-tag>
        //   if (text == true) {
        //     return (
        //       <a-switch
        //         checked-children="启用"
        //         un-checked-children="禁用"
        //         default-checked
        //         onclick={e => this.changeState(e, record)}
        //       />
        //     );
        //   } else {
        //     return (
        //       <a-switch
        //         checked-children="启用"
        //         un-checked-children="禁用"
        //         onclick={e => this.changeState(e, record)}
        //       />
        //     );
        //   }
        // }
      },
      {
        title: "启用人",
        width: 80,
        dataIndex: "realName",
        key: "realName"
      }
    ];
    return {
      dataSource: [],
      currentAccount: {}, //当前 账套
      columns,
      selectedRowKeys: [], //table选中keys
      selectedRows: [], //table选中records
      //表格滚动条
      scroll: { y: 500, x: 500 }
    };
  },
  mounted() {
    this.list();
  },
  methods: {
    //获取 账套 模块
    list() {
      const { currentAccount } = this;
      if (!currentAccount.id) return false;
      ListAccountModule({ accountId: currentAccount.id })
        .then(response => {
          if (response.code === 200) {
            const { data } = response;
            this.dataSource = data;
          }
        })
        .catch(error => {});
    },
    //批量 保存
    batchSave(postData) {
      const { currentAccount } = this;
      postData = postData.map(item => {
        item.accountId = currentAccount.id;
        return item;
      });
      SaveAccountModule(postData)
        .then(response => {
          if (response.code === 200) {
            this.selectedRowKeys = [];
            this.selectedRows = [];
            //刷新数据
            this.list();
            this.$message.success("保存成功");
          }
        })
        .catch(error => {});
    },
    //选择表格项
    onSelectChange(selectedRowKeys, selectedRows) {
      console.log(selectedRowKeys, selectedRows);
      this.selectedRowKeys = selectedRowKeys;
      this.selectedRows = selectedRows;
    },
    //选择框的默认属性配置
    getCheckboxProps(record) {
      return {
        props: {
          disabled: record.isLocked // Column configuration not to be checked
          // name: record.name,
          // indeterminate: disableKeys.includes(record.key)
        }
      };
    },
    changeState(e, record) {
      //-gw
      console.log(e, record);
      let rearr = [];
      rearr.push(record);
      let status = !e?1:0;
      let postData = rearr.map(f => {
        return {
          id: f.id,
          orgModuleId: f.orgModuleId,
          status: status
        };
      });
      this.batchSave(postData);
    },
    //启用
    enabled() {
      if (this.selectedRows.length == 0) {
        this.$message.warning("至少选择一条数据");
        return false;
      }
      const { selectedRows } = this;
      let postData = selectedRows.map(f => {
        return {
          id: f.id,
          orgModuleId: f.orgModuleId,
          status: 1
        };
      });

      this.batchSave(postData);
      console.log("启用功能数据", postData, selectedRows);
    },
    //禁用
    unabled() {
      if (this.selectedRows.length == 0) {
        this.$message.warning("至少选择一条数据");
        return false;
      }
      const { selectedRows } = this;
      let postData = selectedRows.map(f => {
        return {
          id: f.id,
          orgModuleId: f.orgModuleId,
          status: 0
        };
      });
      this.batchSave(postData);
      console.log("禁用功能数据", postData, selectedRows);
    }
  }
};
</script>
<style lang="less">
.set-wrapper {
  width: 100%;
  .a-button-bar {
    margin-bottom: 10px;
    .btn-close {
      margin-left: 10px;
    }
  }
}
.resize-table-container .ant-table-body {
  height: auto;
}
</style>